<!DOCTYPE html>
<html lang="ch-CN">
<head>
    <meta charset="UTF-8">
    <title>原型对象(构造函数优化*2)</title>
</head>
<style>
    body {
        width: 100%;
        height: 100vh;
        background-color: wheat;
        font-size: 30px;
        text-decoration: none;
        font-family: "华文楷体";
    }
</style>
<script>
    /*
        * 原型:prototype
        *
        * 创建的每一个函数,解析器都会向函数添加一个prototype属性
            - 这个属性对应着一个对象,这个对象就是所谓的原型对象
        * 普通函数没有prototype属性
        * 函数以构造函数调用时,它所创建的对象中都有一个隐含的属性
            - 指向该构造函数的原型对象,可以通过__proto__来访为该属性
        * 判断构造函数对象的原型对象是否与构造函数的原型对象相同 Person1.__proto__==Person.prototype
            - 如果相同说明同一个类(构造函数)的实例都可以访问到这个原型对象(地址相同),就可以实现方法共享等,而不浪费空间
     */
    function Person(name, age, gender) {
        this.name = name
        this.age = age
        this.gender = gender
        // this.sayName = function () {
        //     document.write("name:" + this.name + "age:" + this.age + "gender:" + this.gender + "<br>")
        // }
    }
    // 构造函数的原型对象
    console.log(Person.prototype)
    // 向构造函数的原型对象中添加sayName属性
    Person.prototype.sayName =function (){
        document.write("name:" + this.name + "age:" + this.age + "gender:" + this.gender + "<br>")
    }

    // Person的分类对象实例化
    let Person1 = new Person("小红", 20, "女")
    let Person2 = new Person("小兰", 30, "女")
    let Person3 = new Person("小紫", 26, "男")

    // 判断构造函数的原型对象是否与构造函数的原型对象相同
    document.write("判断构造函数的原型对象是否与构造函数的原型对象相同:<br>")
    document.write(Person1.__proto__==Person.prototype)
    document.write("<br><br>")

    Person1.sayName()
    Person2.sayName()
    Person3.sayName()
    // 控制台查看类别
    console.log(Person1)
    console.log(Person2)
    console.log(Person3)
    // 判断对象是否使用了同一个方法
    document.write("<br>判断对象Person1和Person2是否使用了同一个方法:<br>")
    document.write(Person1.sayName == Person2.sayName)
    // 使用枚举判断一个属性是否在对象中,如果没有,但是原型中有 也会返回true
    document.write("<br>使用枚举判断一个属性是否在对象中:<br>")
    document.write("sayName" in Person.prototype)
    // 可以使用hasOwnProperty()来检查自身对象中
    document.write("<br>使用hasOwnProperty()来检查自身对象中:<br>")
    document.write(Person.prototype.hasOwnProperty("name"))
</script>
<body>
</body>
</html>